#define cardTree(modelName,url,aTh,aTd)
<link rel="stylesheet" href="/assets/jquery/jquery.treegrid.min.css">
<link rel="stylesheet" href="/assets/bootstrap/bootstrap-table.min.css">
<div class="card">
    <div class="card-header">
        <h2 class="card-title">#(modelName??)</h2>
        <div class="progress">
            <div class="progress-bar bg-success" role="progressbar" style="width: 100%" aria-valuenow="100"
                 aria-valuemin="0"
                 aria-valuemax="100">
            </div>
        </div>
        <small class="card-subtitle">
            <button class="btn btn-secondary" onclick="$('#categoryId').val(0)" data-toggle="modal"
                    data-target="#addFirstLev">增加一级
            </button>
        </small>
    </div>
    <div class="card-block">
        <table id="treeTable"></table>
        <!--添加一级-->
        <div class="modal fade" id="addFirstLev" tabindex="-1">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title pull-left">添加分类信息</h5>
                    </div>
                    <div class="modal-body">
                        <input type="hidden" id="categoryId"/>
                        <div class="form-group has-success">
                            <label class="form-control-label">名称</label>
                            <input type="text" id="categoryName" class="form-control form-control-success"
                                   placeholder="请输入名称！">
                            <i class="form-group__bar"></i>
                        </div>
                        #if(url=="erp/erpstocksort")
                        <div class="form-group has-success">
                            <label class="form-control-label">编号</label>
                            <input type="text" id="code" class="form-control" oninput="value=value.replace(/[^\d]/g,'')"
                                   placeholder="请输入编号！">
                            <i class="form-group__bar"></i>
                        </div>
                        #end
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-link"
                                onclick="saveFirstBtn($('#categoryId').val(),$('#categoryName').val(),$('#code').val())">
                            保存
                        </button>
                        <button type="button" class="btn btn-link" data-dismiss="modal" id="closeFirstBtn">关闭</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="/assets/bootstrap/bootstrap-table.min.js"></script>
<script src="/assets/bootstrap/bootstrap-table-treegrid.js"></script>
<script src="/assets/jquery/jquery.treegrid.min.js"></script>
<script type="text/javascript">
    var $table = $('#treeTable');
    var ath = "#(aTh??)".replace("[", "").replace("]", "").split(",");
    var atd = "#(aTd??)".replace("[", "").replace("]", "").split(",");
    var list = [];
    $.each(ath, function (hk, kv) {
        var map = {};
        map['field'] = atd[hk].trim();
        map['title'] = kv.trim();
        if (atd[hk].trim() == "operate") {
            map['formatter'] = operateFormatter;
            map['width'] = 140;
        }
        list.push(map);
    })
    $(function () {
        $('.modal-backdrop').remove();
        $.post("/admin/#(url??)/treeList", function (result) {
            $table.bootstrapTable({
                idField: "id",
                dataType: 'json',
                data: result,
                columns: list,
                //在哪一列展开树形
                treeShowField: 'name',
                //指定父id列
                parentIdField: 'pId',
                onResetView: function (result) {
                    $table.treegrid({
                        treeColumn: 0,
                        onChange: function () {
                            $table.bootstrapTable('resetWidth');
                        }
                    });
                }, onDblClickRow: function (row, $element) {
                    swal({
                        title: '名称修改',
                        html: '当前名称:<input type="text" value="' + row.name + '" id="rowName"/>',
                        /*type: 'warning',*/
                        showCancelButton: true,width:800,
                        confirmButtonText: '修改',
                        cancelButtonText: '取消',
                    }).then(function () {
                        $.post("/admin/#(url??)/saveOrUpdate", {
                            "id": row.id,
                            "name": $("#rowName").val(),
                            "pId": row.pId
                        }, function (ret) {
                            showRetMsg(ret, '/admin/#(url??)');
                        })
                    }).catch(swal.noop);

                }
            });
        });
    });

    function operateFormatter(value, row, index) {
        return ['<button type="button" class="btn btn-secondary btn--icon-text waves-effect" onclick="$(\'#categoryId\').val(' + row.id + ')"  data-toggle="modal" data-target="#addFirstLev"><i class="zmdi zmdi-plus"></i></button>',
            '<button type="button" class="btn btn-secondary btn--icon-text waves-effect" onclick="deleteBtn(' + row.id + ')"><i class="zmdi zmdi-close"></i></button>']
            .join('');
    }

    /*添加一级分类*/
    function saveFirstBtn(a, b, c) {
        console.info(a, b);
        $.post("/admin/#(url??)/saveOrUpdate", {"pId": a, "name": b, "code": c}, function (ret) {
            $("#closeFirstBtn").click();
            showRetMsg(ret, '/admin/#(url??)');
        })
    }

    /*刪除*/
    function deleteBtn(a) {
        $.post("/admin/#(url??)/delete", {"k": a}, function (ret) {
            showRetMsg(ret, "/admin/#(url??)");
        })
    }

</script>
#end